﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="SSP.Api.Web._Default" %>

<%@ Import Namespace="SSP.Api" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head runat="server">
    <title>Pixtology</title>
    <link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />

    <script src="js/prototype.js" type="text/javascript"></script>

    <script src="js/scriptaculous.js?load=effects" type="text/javascript"></script>

    <script src="js/lightbox.js" type="text/javascript"></script>

    <style type="text/css">
        body
        {
            background: #111;
            color: #333;
            font: 13px 'Lucida Grande' , Verdana, sans-serif;
            margin: 0;
        }
        div#header
        {
            background: #000;
            padding: 20px;
            margin: 0;
        }
        div#header img
        {
            float: left;
            margin-right: 10px;
        }
        h1
        {
            color: #fafafa;
            font-weight: normal;
            font-size: 25px;
            margin: 0;
        }
        p
        {
            margin: 5px 0 0;
            padding-left: 110px;
        }
        div#images
        {
            padding: 10px 20px;
        }
        a img
        {
            border: 0;
        }
        .assetGallery
        {
            padding: 2px;
        }
        #topnav
        {
            text-align: right;
            background: #000;
            padding: 4px;
            font-size: 14px;
        }
        #topnav A:link
        {
            text-decoration: none;
            color: White;
        }
        #topnav A:visited
        {
            text-decoration: none;
            color: White;
        }
        #topnav A:active
        {
            text-decoration: none;
            color: White;
        }
        #topnav A:hover
        {
            text-decoration: none;
            color: White;
        }
    </style>

    <script type="text/javascript">
<!--
        function popup(url) {
            var width = 820;
            var height = 680;
            var left = (screen.width - width) / 2;
            var top = (screen.height - height) / 2;
            var params = 'width=' + width + ', height=' + height;
            params += ', top=' + top + ', left=' + left;
            params += ', directories=no';
            params += ', location=no';
            params += ', menubar=no';
            params += ', resizable=no';
            params += ', scrollbars=no';
            params += ', status=no';
            params += ', toolbar=no';
            newwin = window.open(url, 'windowname5', params);
            if (window.focus) { newwin.focus() }
            return false;
        }
// -->
    </script>

</head>
<body>
    <form id="form1" runat="server">
    <div id="topnav">
        <a href="javascript: void(0)" onclick="popup('SlideShow.aspx?AlbumID=<%=Album.Id%>')">
            View SlideShow</a></div>
    <div id="header">
        <a href="javascript: void(0)" onclick="popup('SlideShow.aspx?AlbumID=<%=Album.Id%>')">
            <%--<a href="SlideShow.aspx?AlbumID=<%=Album.Id%>" target="_blank" >--%>
            <img src="<%= Album.Preview.Url %>" width="<%= Album.Preview.Width %>" height="<%= Album.Preview.Height %>"
                alt="" /></a>
        <h1>
            <%= Album.Name %></h1>
        <%= Director.Utils.convert_line_breaks(Album.Description) %>
    </div>
    <div id="images">
        <% if (Album.Contents.Length > 0)
           { %>
        <table class="assetGallery">
            <tbody>
                <%
                    int mod = Album.Contents.Length % ColumnCount;

                    if (mod == 0)
                    {
                        mod = Album.Contents.Length / ColumnCount;
                    }
                    else
                    {
                        mod = (Album.Contents.Length / ColumnCount) + 1;
                    }
                    int cur = 0; 
                %>
                <% for (int n = 1; n <= mod; n++)
                   { %>
                <tr>
                    <% for (int i = 0; i < ColumnCount; i++)
                       { %>
                    <td>
                        <% if (cur < Album.Contents.Length)
                           { %>
                        <a href="javascript: void(0)" onclick="popup('SlideShow.aspx?DisplayMode=Manual&AlbumID=<%=Album.Id%>#id=album-<%=Album.Id%>&num=<%=cur+1%>')" title="<%= Album.Contents[cur].Caption %>">
                            <img src="<%= Album.Contents[cur].CustomImages["thumb"].Url %>" width="<%= Album.Contents[cur].CustomImages["thumb"].Width %>"
                                height="<%= Album.Contents[cur].CustomImages["thumb"].Height %>" alt="<%= Album.Contents[cur].Title %>"
                                title="Click for larger image." /></a><br />
                               <%-- <a href="javascript: void(0)" onclick="popup('SlideShow.aspx?DisplayMode=Manual&AlbumID=<%=Album.Id%>#id=album-<%=Album.Id%>&num=<%=cur+1%>')">
            View&nbsp;SlideShow</a>--%>
                        <% }
                           else
                           { %>
                        &nbsp;
                        <% } %>
                    </td>
                    <% cur++; %>
                    <% } %>
                </tr>
                <% } %>
            </tbody>
            <tfoot>
                <tr>
                    <td colspan="<%=ColumnCount%>" align="center">
                        Click an image for a larger view.
                    </td>
                </tr>
            </tfoot>
        </table>
        <% }
           else
           { %>
        There are no Assets for this .
        <% } %>
    </div>
    </form>
</body>
</html>
